📄 Description

Ticket: #5940

Breaking Changes

• Renamed post-tab-header component to post-tab-item
• Renamed property panel → name in post-tab-item
• Renamed property name → for in post-tab-panel
• Renamed property activePanel → activeTab in post-tabs
• Changed slot structure: tab items now use default slot, panels use panels slot

New Features

• Added navigation variant for anchor-based navigation
• Automatic variant detection based on presence of anchor links
• Navigation mode renders semantic <nav> element with proper ARIA attributes

Testing

• Added Cypress tests for Components package
• Added Cypress tests for Angular integration (including accessibility testing with Axe)
• Added Playwright tests for Next.js integration (including accessibility testing with Axe)

Documentation

• Updated Storybook stories with variant controls
• Added examples for both panels and navigation variants

Animation:

• Cleaned up animations to prevent memory leaks by canceling running animations on component destruction.

Note:
The controls table still shows both CSS Shadow Parts for both variants because Storybook automatically extracts these from the component's JSDoc part annotations at build time, preventing any dynamic filtering based on the selected variant control.

Unlike slots, which are manually defined in the stories configuration and support conditional visibility using the if property, CSS Shadow Parts are auto-generated from the component source code.

🚀 Preview Link

Tabs component

📝 Checklist

• ✅ My code follows the style guidelines of this project
• 🛠️ I have performed a self-review of my own code
• 📄 I have made corresponding changes to the documentation
• ⚠️ My changes generate no new warnings or errors
• 🧪 I have added tests that prove my fix is effective or that my feature works
• ✔️ New and existing unit tests pass locally with my changes